<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@page import="com.lx.domain.*"%>
<style>
 #div_search,#div_search>*{
 	vertical-align: middle;
 }
</style>
 <table id="box" align= "center"></table>

<% Tree t = new Tree() ; %>

<div id="tb" style="padding:5px;">
	<div style="margin-bottom:5px;">
		<a href="#" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="obj.add();">添加</a>
		<a href="#" class="easyui-linkbutton" iconCls="icon-edit" plain="true" onclick="obj.edit();">修改</a>
		<a href="#" class="easyui-linkbutton" iconCls="icon-remove" plain="true" onclick="obj.remove();">删除</a>
		<a href="#" class="easyui-linkbutton" iconCls="icon-save" plain="true" style="display:none;" id="save" onclick="obj.save();">保存</a>
		<a href="#" class="easyui-linkbutton" iconCls="icon-redo" plain="true" style="display:none;" id="redo" onclick="obj.redo();">取消编辑</a>		
	</div>
	<div id="div_search" style="padding:0 0 0 7px;color:#333;">
		查询帐号：<input type="text" class="textbox" name="username" style="width:110px">
		创建时间从：<input type="text" name="date_from" class="easyui-datebox" editable="false" style="width:110px">
		到：<input type="text" name="date_to" class="easyui-datebox" editable="false" style="width:110px">
		<a href="#" class="easyui-linkbutton " iconCls="icon-search" onclick="obj.search();">查询</a>
	</div>
</div>
   
   <div id="dg"></div>
   


 <script type="text/javascript">
 
$(function () {  
	obj = {
		editRow : undefined,
		search : function () {
			$('#box').datagrid('load', {
				name : $.trim($('input[name="username"]').val()),
				date_from : $('input[name="date_from"]').val(),
				date_to : $('input[name="date_to"]').val(),
			});
		},
		add : function () {
			$('#save,#redo').show();
			/*
			//当前页行结尾添加
			$('#box').datagrid('appendRow', {
				user : 'bnbbs',
				email : 'bnbbs@163.com',
				date : '2014-11-11',
			});
			*/
			
			if (this.editRow == undefined) {
				//添加一行 
				$('#box').datagrid('insertRow', {
					index : 0,
					row : {
						/*
						user : 'bnbbs',
						email : 'bnbbs@163.com',
						date : '2014-11-11',
						*/
					},
				});
				
				//将第一行设置为可编辑状态
				$('#box').datagrid('beginEdit', 0);
				
				this.editRow = 0;
			}
		},
		save : function () {
			//这两句不应该放这里，应该是保存成功后，再执行
			//$('#save,#redo').hide();
			//this.editRow = false;
			//将第一行设置为结束编辑状态
			$('#box').datagrid('endEdit', this.editRow);
		},
		redo : function () {
			$('#save,#redo').hide();
			this.editRow = undefined;
			$('#box').datagrid('rejectChanges');
		},
		edit : function () {
			var rows = $('#box').datagrid('getSelections');
			if (rows.length == 1) {
				if (this.editRow != undefined) {
					$('#box').datagrid('endEdit', this.editRow);
				}
			
				if (this.editRow == undefined) {
					var index = $('#box').datagrid('getRowIndex', rows[0]);
					$('#save,#redo').show();
					$('#box').datagrid('beginEdit', index);
					this.editRow = index;
					$('#box').datagrid('unselectRow', index);
				}
			} else {
				$.messager.alert('警告', '修改必须或只能选择一行！', 'warning');
			}
		},
		remove : function () {
			var rows = $('#box').datagrid('getSelections');
			if (rows.length > 0) {
				$.messager.confirm('确定操作', '您正在要删除所选的记录吗？', function (flag) {
					if (flag) {
						var ids = [];
						for (var i = 0; i < rows.length; i ++) {
							ids.push(rows[i].id);
						}
						//console.log(ids.join(','));
						$.ajax({
							type : 'POST',
							url : 'user/delete',
							data : {
								ids : ids.join(','),
							},
							beforeSend : function () {
								$('#box').datagrid('loading');
							},
							success : function (data) {
								if (data) {
									$('#box').datagrid('loaded');
									$('#box').datagrid('load');
									$('#box').datagrid('unselectAll');
									$.messager.show({
										title : '提示',
										msg : data + '个用户被删除成功！',
									});
								}
							},
						});
					}
				});
			} else {
				$.messager.alert('提示', '请选择要删除的记录！', 'info');
			}
		},
	};



  $('#box').datagrid({
        fit : true,
		//width : 800,
		//url : 'content.json',
		url : 'user/user_datagrid',
		title : '用户列表',
		iconCls : 'icon-search',
		striped : true,
		nowrap : true,
		rownumbers : true,
		//singleSelect : true,
		fitColumns : true,
		columns : [[
			{
				field : 'id',
				title : '编号',
				sortable : true,
				width : 100,
				checkbox : true,
			},
			{
				field : 'username',
				title : '帐号',
				sortable : true,
				width : 100,
				editor : {
					type : 'validatebox',
					options : {
						required : true,
					},
				},
			},
			{
				field : 'creatTime',
				title : '注册时间',
				sortable : true,
				width : 100,
				editor : {
					type : 'datetimebox',
					options : {
						required : true,
						editable: false, //不允许手动输入 
					},
				},
				formatter :  formatDateBoxFull,
			},
			{
				field : 'role',
				title : '权限',
				sortable : true,
				width : 100,
				editor : {
					type : 'validatebox',
					},
			},
			{
				field : 'isForbidden',
				title : '是否禁用',
				sortable : false,
				width : 100,
				editor : {
					type : 'combobox',
					options : {
					          data :  [{"value1":1 ,"show1" :"禁用" },{"value1":0 ,"show1" :"正常" }] ,
					          valueField: 'value1',    
                              textField: 'show1', 
                              editable: false, //不允许手动输入 
                              panelHeight: 'auto' ,
                             /*  onLoadSuccess:function(){
$(this).combobox('setValue',0)
$(this).combobox('setText','正常')}, */
                    /*        onLoadSuccess: function () { //加载完成后,设置选中第一项
                var val = $(this).combobox("getData");
                for (var item in val[0]) {
                    if (item == "id") {
                        $(this).combobox("select", val[0][item]);
                    }
                }
            } */
                              },
					},
				formatter : function(value ,rowData ,rowIndex){
				    if(value > 0){
				      return "禁用" ;
				    }else{
				      return "正常" ;
				    }
				}
			},
		]],
		toolbar : '#tb',
		border : false,
		pagination : true,
		pageSize : 5,
		pageList : [5, 20, 30],
		pageNumber : 1,
		sortName : 'id',
		sortOrder : 'DESC',
		
		//双击编辑
		onDblClickRow : function (rowIndex, rowData) {
		
			if (obj.editRow != undefined) {
				$('#box').datagrid('endEdit', obj.editRow);
			}
		
			if (obj.editRow == undefined) {
				$('#save,#redo').show();
				$('#box').datagrid('beginEdit', rowIndex);
				obj.editRow = rowIndex;
			}
			
		},
		onAfterEdit : function (rowIndex, rowData, changes) {
			$('#save,#redo').hide();
			
			var inserted = $('#box').datagrid('getChanges', 'inserted');
			var updated = $('#box').datagrid('getChanges', 'updated');
			
			var url = info =  '';
			
			//新增用户
			if (inserted.length > 0) {
				url = 'user/user_update';
				info = '新增';
			}
			
			//修改用户
			if (updated.length > 0) {
				url = 'user/user_update';
				info = '修改';
			}
			
			$.ajax({
				type : 'POST',
				url : url,
				data : {
					id : rowData["id"],
					username : rowData["username"],
					creatTime1 : rowData["creatTime"],
					role : rowData["role"],
					isForbidden : rowData["isForbidden"],
				},
				beforeSend : function () {
					$('#box').datagrid('loading');
				},
				success : function (data) {
					if (data == "success") {
						$('#box').datagrid('loaded');
						$('#box').datagrid('load');
						$('#box').datagrid('unselectAll');
						$.messager.show({
							title : '提示',
							msg : '用户' + info + '成功！',
						});
						obj.editRow = undefined;
					}else{
					    $('#box').datagrid('loaded');
						$('#box').datagrid('load');
						$('#box').datagrid('unselectAll');
						$.messager.show({
							title : '提示',
							msg : '用户名重复，'+ info + '失败',
						});
						obj.editRow = undefined;
					}
				},
			});
			//console.log(rowData);
		},
	});
	
});
  


       
/*该方法使日期列的显示符合阅读习惯*/
//datagrid中用法：{ field:'StartDate',title:'开始日期', formatter: formatDatebox, width:80}
function formatDatebox(value) {
    if (value == null || value == '') {
        return '';
    }
    var dt = parseToDate(value);
    return dt.format("yyyy-MM-dd"); 
}

/*转换日期字符串为带时间的格式*/
function formatDateBoxFull(value) {
    if (value == null || value == '') {
        return '';
    }
    var dt = parseToDate(value);
    return dt.format("yyyy-MM-dd hh:mm:ss");
}

//辅助方法(转换日期)
function parseToDate(value) {
    if (value == null || value == '') {
        return undefined; 
    }

    var dt;
    if (value instanceof Date) {
        dt = value;
    }
    else {
        if (!isNaN(value)) {
            dt = new Date(value);
        }
        else if (value.indexOf('/Date') > -1) {
            value = value.replace(/\/Date\((-?\d+)\)\//, '$1');
            dt = new Date();
            dt.setTime(value);
        } else if (value.indexOf('/') > -1) {
            dt = new Date(Date.parse(value.replace(/-/g, '/')));
        } else {
            dt = new Date(value);
        }
    }
    return dt;
}

//为Date类型拓展一个format方法，用于格式化日期
Date.prototype.format = function (format) //author: meizz 
{
    var o = {
        "M+": this.getMonth() + 1, //month 
        "d+": this.getDate(),    //day 
        "h+": this.getHours(),   //hour 
        "m+": this.getMinutes(), //minute 
        "s+": this.getSeconds(), //second 
        "q+": Math.floor((this.getMonth() + 3) / 3),  //quarter 
        "S": this.getMilliseconds() //millisecond 
    };
    if (/(y+)/.test(format))
        format = format.replace(RegExp.$1,
                (this.getFullYear() + "").substr(4 - RegExp.$1.length));
    for (var k in o)
        if (new RegExp("(" + k + ")").test(format))
            format = format.replace(RegExp.$1,
                    RegExp.$1.length == 1 ? o[k] :
                        ("00" + o[k]).substr(("" + o[k]).length));
    return format;
};
 
//以下拓展是为了datagrid的日期列在编辑状态下显示正确日期
$.extend(
    $.fn.datagrid.defaults.editors, {
        datebox: {
            init: function (container, options) {
                var input = $('<input type="text">').appendTo(container);
                input.datebox(options);
                return input;
            },
            destroy: function (target) {
                $(target).datebox('destroy');
            },
            getValue: function (target) {
                return $(target).datebox('getValue');
            },
            setValue: function (target, value) {
                $(target).datebox('setValue', formatDatebox(value));
            },
            resize: function (target, width) {
                $(target).datebox('resize', width);
            }
        },
        datetimebox:{
            init: function (container, options) {
                var input = $('<input type="text">').appendTo(container);
                input.datetimebox(options);
                return input;
            },
            destroy: function (target) {
                $(target).datetimebox('destroy');
            },
            getValue: function (target) {
                return $(target).datetimebox('getValue');
            },
            setValue: function (target, value) {
                $(target).datetimebox('setValue', formatDateBoxFull(value));
            },
            resize: function (target, width) {
                $(target).datetimebox('resize', width);
            }
        }
    });

    
    </script>

